<?php include('scripts.php'); ?>

<script type="text/javascript">
$(function() {
    $.populateDOB({
        dobYear : $("#dob_year")
        ,dobMonth : $("#dob_month")
        ,dobDay : $("#dob_day")
        ,dobFull : $("#dob")
        ,defaultValue : "<?php echo $cms_member->getDob()?>"
    });

    var container = $('div.errorContainer');
    $("#registerForm").validate({
        errorLabelContainer: $("ol", container),
        errorContainer: $('div.errorContainer'),
        wrapper: 'li',
        meta: "validate",
        messages : {
            fullname: {
                required: "<?php echo __('%1% is required.', array('%1%' => 'Full name')) ?>"
            },
            address1: {
                required: "<?php echo __('%1% is required.', array('%1%' => 'Address')) ?>"
            },
            city: {
                required: "<?php echo __('%1% is required.', array('%1%' => 'City')) ?>"
            },
            state: {
                required: "<?php echo __('%1% is required.', array('%1%' => 'State')) ?>"
            },
            postcode: {
                required: "<?php echo __('%1% is required.', array('%1%' => 'Postcode')) ?>"
            },
            country: {
                required: "<?php echo __('%1% is required.', array('%1%' => 'Country')) ?>"
            },
            telephone: {
                number: "<?php echo __('Please enter your %1% <b>Number</b>.', array('%1%' => 'Telephone')) ?>"
                , required: "<?php echo __('%1% is required.', array('%1%' => 'Telephone')) ?>"
            },
            password: {
                required: "<?php echo __('%1% is required.', array('%1%' => 'password')) ?>"
            },
            confirmation: {
                required: "<?php echo __('%1% is required.', array('%1%' => 'Confirm Password')) ?>"
                , equalTo: "<?php echo __('Please enter the same password as above') ?>"
            },
            email_address: {
                required: "<?php echo __('%1% is required.', array('%1%' => 'Email address')) ?>"
                , remote: "<?php echo __('Email address already in use.') ?>"
            }
        },
        rules : {
            "fullname" : {
                required : true,
                minlength : 6
            },
            "address1" : {
                required : true,
                minlength : 10
            },
            "city" : {
                required : true
            },
            "state" : {
                required : true
            },
            "postcode" : {
                required : true,
                minlength : 3
            },
            "country" : {
                required : true
            },
            "telephone" : {
                required : true
                , number:true
                , minlength : 10
            },
            "email_address" : {
                required : true
                , email: true
                , remote: "/member/verifyEmailAddress"
            },
            "password" : {
                required : true
            },
            "confirmation" : {
                required : true,
                minlength : 6,
                equalTo: "#password-new"
            }
        },
        submitHandler: function(form) {
            form.submit();
        }
    });
    $("#validate-close").click(function(){
        $(container).hide(500);
    });
    $("#btnSave,#btnLogin").button({
        icons: {
            primary: "ui-icon-circle-check"
        }
    });
});
</script>

<div style="z-index: 999; position: fixed; top:0px; right:0px;" class="errorContainer ui-state-error-validate ui-corner-all container ui-widget" id="validateContainer">
    <p>
        <span style="float: left; margin-right: .3em;" class="ui-red ui-icon ui-icon-alert"></span>
        <a href="#" id="validate-close" role="button" class="ui-dialog-titlebar-close ui-corner-all">
            <span style="position:absolute; right : -2px; margin-right: .3em; border: 1px solid #FBCB09; color: #C77405;" class="ui-icon ui-icon-closethick"></span>
        </a>
        <strong id='_msg'>
            <ol style="padding-top:0px;margin-top:0px;margin-bottom:0px"></ol>
        </strong>
    </p>
</div>

<div id="content">

<!-- ========== CATEGORIES TABS ========= -->
<!-- ==================================== -->
<table id="contentMainWrapper" border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td id="column-left" style="width: 215px;">
    <div style="width:215px;">
        <!--// bof: categories //-->
        <div class="box" id="categories" style="width:215px;">
            <div class="box-border">
                <div class="box-head">
                    <?php echo __('Categories') ?>
                </div>
                <div class="box-body">
                    <?php include_component('component', 'categoriesSideMenu') ?>
                </div>
            </div>
        </div>
        <!--// eof: categories //-->
        <!--// bof: specials //-->
        <div class="box" id="specials" style="width:215px;">
            <div class="box-border">
                <div class="box-head">
                    <a href="<?php echo url_for("/product/specialItem") ?>"><?php echo __('Specials') ?></a>
                </div>
                <div class="box-body">
                    <?php include_component('component', 'specialsSideMenu', array('param' => 'will implement for categoryType')) ?>
                </div>

            </div>
        </div>
        <!--// eof: specials //-->
    </div>
</td>

<td id="column-center" valign="top">

<div class="column-center-padding">

<div class="centerColumn" id="loginDefault">

<h1 id="loginDefaultHeading"><?php echo __('Welcome, Please Sign In') ?></h1>


<!--BOF normal login-->
<form name="loginForm" id="loginForm" action="/member/doLogin" method="post">
    <?php if ($sf_flash->has('errorMsgLogin')): ?>
        <?php echo $sf_flash->get('errorMsgLogin') ?>
    <?php endif; ?>
    <fieldset>
        <legend><?php echo __('Returning Customers: Please Log In') ?></legend>

        <label class="inputLabel" for="login-email-address"><?php echo __('Email Address') ?>:</label>
        <input name="email_address" size="41" maxlength="96" id="login-email-address" type="text">
        <br class="clearBoth">

        <label class="inputLabel" for="login-password"><?php echo __('Password') ?>:</label>
        <input name="password" size="41" maxlength="40" id="login-password" type="password">
        <br class="clearBoth">

        <?php if ($sf_flash->has('errorMsg')): ?>
        <label class="inputLabel"></label>
        <span class="alert"><?php echo $sf_flash->get('errorMsg') ?></span>
		<?php endif; ?>
		<?php if ($sf_flash->has('successMsg')): ?>
        <label class="inputLabel"></label>
        <span class="font"><?php echo $sf_flash->get('successMsg') ?></span>
		<?php endif; ?>
    </fieldset>

    <div class="buttonRow forward"><button id="btnLogin"><?php echo __('Sign In') ?></button></div>
    <div class="buttonRow back important"><a href="/home/forgotPassword"><?php echo __('Forgot your password') ?>?</a></div>
</form>
<br class="clearBoth">

<form name="registerForm" id="registerForm" action="/member/register" method="post">
    <fieldset>
    <legend><?php echo __('New? Please Provide Your Billing Information') ?></legend>

        <div class="information">Create a login profile with <strong>Walao Stationery Store</strong> which allows you to shop faster,
            track the status of your current orders and review your previous orders.
        </div>

        <div class="alert forward">* <?php echo __('Required information') ?></div>
        <br class="clearBoth">

        <fieldset>
        <legend><?php echo __('Company Details') ?></legend>
            <label class="inputLabel" for="company"><?php echo __('Company Name') ?>:</label>
            <input name="company" size="41" maxlength="64" id="company" type="text">
        </fieldset>

        <fieldset>
        <legend><?php echo __('Address Details') ?></legend>
            <input name="gender" value="M" id="gender-male" checked="checked" type="radio"><label class="radioButtonLabel" for="gender-male">Mr.</label>
            <input name="gender" value="F" id="gender-female" type="radio"><label class="radioButtonLabel" for="gender-female">Ms.</label>
            <span class="alert">*</span>
            <br class="clearBoth">

            <label class="inputLabel" for="firstname">Full Name <span class="alert">*</span>:</label>
            <input name="fullname" size="33" maxlength="32" id="firstname" type="text" value="<?php echo $cms_member->getFullname()?>">
            <br class="clearBoth">

            <label class="inputLabel" for="nric">NRIC :</label>
            <input name="nric" size="33" maxlength="32" id="nric" type="text"  value="<?php echo $cms_member->getNric()?>" style="margin: 0 0 3px; vertical-align: middle; width: 49%;">
            <br class="clearBoth">

            <label class="inputLabel" for="street-address">Street Address <span class="alert">*</span>:</label>
            <input name="address1" size="41" maxlength="64" id="street-address" type="text" value="<?php echo $cms_member_address->getAddress1()?>">
            <br class="clearBoth">

            <label class="inputLabel" for="suburb">Address Line 2:</label>
            <input name="address2" size="33" maxlength="32" id="suburb" type="text" value="<?php echo $cms_member_address->getAddress2()?>">
            <br class="clearBoth">

            <label class="inputLabel" for="city">City <span class="alert">*</span>:</label>
            <input name="city" size="33" maxlength="32" id="city" type="text" value="<?php echo $cms_member_address->getCity()?>">
            <br class="clearBoth">

            <label class="inputLabel" for="state" id="stateLabel">State/Province <span class="alert" id="stText">*</span>:</label>
            <input name="state" size="33" maxlength="32" id="state" type="text" value="<?php echo $cms_member_address->getState()?>">
            <br class="clearBoth">

            <label class="inputLabel" for="postcode">Post/Zip Code <span class="alert">*</span>:</label>
            <input name="postcode" size="11" maxlength="10" id="postcode" type="text" value="<?php echo $cms_member_address->getPostcode()?>">
            <br class="clearBoth">

            <label class="inputLabel" for="country">Country <span class="alert">*</span>:</label>
            <?php include_component('component', 'countrySelectOption', array('countrySelected' => $cms_member_address->getCountry(), 'countryName' => 'country', 'countryId' => 'country')) ?>
            <br class="clearBoth">
        </fieldset>

        <fieldset>
            <legend>Additional Contact Details</legend>
            <label class="inputLabel" for="telephone">Telephone <span class="alert">*</span>:</label>
            <input name="telephone" size="33" maxlength="32" id="telephone" type="text" value="<?php echo $cms_member->getContact()?>">
            <br class="clearBoth">
            <label class="inputLabel" for="fax">Fax Number:</label>
            <input name="fax" id="fax" type="text" value="<?php echo $cms_member->getFax()?>">
        </fieldset>

        <fieldset>
            <legend>Verify Your Age</legend>
            <label class="inputLabel" for="dob">Date of Birth <span class="alert">*</span>:</label>
            <select id="dob_year" style="width:60"></select>
            <select id="dob_month" style="width:40"></select>
            <select id="dob_day" style="width:40"></select>
            <input name="dob" readonly="readonly" type="hidden" id="dob" tabindex="14" class="bp_05" value="<?php echo $cms_member->getDob()?>"/>
            <br class="clearBoth">
        </fieldset>

        <fieldset>
            <legend>Login Details</legend>
            <label class="inputLabel" for="email-address">Email Address <span class="alert">*</span>:</label>
            <input name="email_address" size="41" maxlength="96" id="email-address" type="text" value="<?php echo $app_user->getUsername()?>">
            <br class="clearBoth">

            <label class="inputLabel" for="password-new">Password <span class="alert">*</span>:</label>
            <input name="password" size="21" maxlength="40" id="password-new" type="password" value="<?php echo $app_user->getKeepPassword()?>">
            <br class="clearBoth">

            <label class="inputLabel" for="password-confirm">Confirm Password <span class="alert">*</span>:</label>
            <input name="confirmation" size="21" maxlength="40" id="password-confirm" type="password" value="<?php echo $app_user->getKeepPassword()?>">
            <br class="clearBoth">
        </fieldset>

        <fieldset>
            <legend>Newsletter and Email Details</legend>
            <input name="newsletter" value="1" id="newsletter-checkbox" type="checkbox">
            <label class="checkboxLabel" for="newsletter-checkbox">Subscribe to Our Newsletter.</label>
            <br class="clearBoth">
        </fieldset>
    </fieldset>

    <div class="buttonRow forward">
    <button type="submit" id="btnSave">Submit</button></div>
</form>
<!--EOF normal login-->
</div>

<div class="clear"></div>
<!--eof content_center-->
</div>
<!-- BOF- BANNER #4 display -->
<!-- EOF- BANNER #4 display -->
</td>
</tr>
</tbody>
</table>

</div>